<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:s="http://jboss.com/products/seam/taglib"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:rich="http://richfaces.org/rich"
	template="/layout/template.xhtml"
	xmlns:a4j="http://richfaces.org/a4j">
	<ui:define name="stylefms">
		<link href="/stylesheet/theme.css" rel="stylesheet" type="text/css" />
		<link href="/stylesheet/fms.css" rel="stylesheet" type="text/css" />
		<link href="/stylesheet/panel.css" rel="stylesheet" type="text/css" />
		<link href="/stylesheet/debug.css" rel="stylesheet" type="text/css" />
	</ui:define>
	<ui:define name="varProjectName">
		<ui:param name="projectName" value="#{appRes['mod.fms.gnd.maintenances.medicamentos']}" />
	</ui:define>


	<ui:define name="body">
	
		
		<a4j:form id="afflicSympForm" ajaxSingle="true">
			
			<rich:panel styleClass="form">
				
				<h:panelGrid>
					<div class="attributes">
						<h:panelGrid columns="2">					
							<s:decorate template="/layout/input.xhtml">
								<ui:define name="label">Enfermedad</ui:define>
								<rich:comboBox value="#{editEnfermSintoma.afflictionDesc}"
									id="afflicSelect" 
									required="true" width="120px"
									requiredMessage="Favor selecccione la enfermedad"
									defaultLabel="Seleccione la Enfermedad"
									converter="#{AfflictionConverter}"
									enableManualInput="true">
									<a4j:support event="onblur" />
									
									<s:selectItems var="aff" value="#{withinHolder.afflictionList()}" label="#{aff.descrip}">
										
									</s:selectItems>								
																		
								</rich:comboBox>
								<div class="msg_container">
								<rich:message for="afflicSelect"/>
								</div>
								
							</s:decorate>
							 
						</h:panelGrid>
					</div>

						<s:decorate template="/layout/displayButton.xhtml" styleClass="button_form">
							<a4j:commandButton value="Agregar" 
							oncomplete="#{rich:component('modalSelect')}.show()" 
							styleClass="button"
							reRender="afflicSympForm">
							
							</a4j:commandButton>
							<rich:spacer width="20px"/>
							<a4j:commandButton value="Eliminar"
								action="#{editEnfermSintoma.removeList()}" reRender="afflicSympGrid, symptomSelect" styleClass="button"/>
							
						</s:decorate>	
					
				</h:panelGrid>
			</rich:panel>
		</a4j:form>
		
		<rich:modalPanel  id="modalSelect" minwidth="1024px" minheight="500px"
			resizeable="false" autosized="true" >
			<f:facet name="header">
				<h:panelGroup>
					<h:outputText value="Agregar Sintomas" />
				</h:panelGroup>
			</f:facet>
			<a4j:form id="symptomSelect" ajaxSingle="true">
				<rich:panel>
					<h:panelGrid columns="2">
						<rich:listShuttle
							sourceValue="#{withinHolder.symptomList()}"
							targetValue="#{editEnfermSintoma.symptomList}" var="symp"
							converter="#{SymptomConverter}" sourceListWidth="220"
							targetListWidth="220"
							copyAllControlLabel="Add All" copyControlLabel="Add"
							removeControlLabel="Delete" removeAllControlLabel="Delete All"
							showButtonLabels="true">
							<f:facet name="sourceCaption">
								Sintomas
							</f:facet>
							<f:facet name="targetCaption">
								Sintomas Seleccionados
							</f:facet>
							<h:column>
								<f:facet name="header">Nombre</f:facet>
								<h:outputText value="#{symp.descrip}" />
							</h:column>
							
						</rich:listShuttle>
							
					</h:panelGrid>
				</rich:panel>

				<s:decorate template="/layout/displayButton.xhtml"
					styleClass="button_form">
					<a4j:commandButton value="Agregar"
						oncomplete="#{rich:component('modalSelect')}.hide()"
						styleClass="button" reRender="afflicSympGridForm" >
						
					</a4j:commandButton>
					
					<rich:spacer width="20px" />
					
					<a4j:commandButton value="Cancelar"
						onclick="#{rich:component('modalSelect')}.hide()"
						styleClass="button" />

				</s:decorate>
			</a4j:form>
		</rich:modalPanel>
		
		<a4j:form id="afflicSympGridForm" ajaxSingle="true">
			<rich:panel styleClass="table_add">
				<rich:datascroller align="center" for="afflicSympGrid" maxPages="15"
					page="#{dataTableScrollerBean.scrollerPage}"
					renderIfSinglePage="false" />

				<rich:dataTable id="afflicSympGrid" value="#{editEnfermSintoma.symptomList}"
					var="symp" rows="5"
					rendered="true">

					<rich:column>
						<f:facet name="header">Sintoma</f:facet>
						<h:outputText value="#{symp.descrip}" />
						
					</rich:column>

					<rich:column>
						<f:facet name="header">
							<h:outputText styleClass="columnHeader" value="Acciones" />
						</f:facet>
						
						<h:selectBooleanCheckbox id="check" value="#{editEnfermSintoma.check}" immediate="false" >
							
							<a4j:support event="onmouseover" ajaxSingle="true">
								<a4j:actionparam name="remove" value="#{symp.descrip}" assignTo="#{editEnfermSintoma.remove}"></a4j:actionparam>
							</a4j:support>
							
							<a4j:support id="checkSupport" event="onchange" ajaxSingle="true"  action="#{editEnfermSintoma.fillList()}">
							</a4j:support>
							
						</h:selectBooleanCheckbox>
						
						<rich:toolTip value="Editar" for="editAction" />
					</rich:column>

				</rich:dataTable>
			</rich:panel>
			
			<rich:panel styleClass="action_form">
			<h:panelGrid>
				<s:decorate template="/layout/displayButton.xhtml"
					styleClass="button_form">
					<a4j:commandButton value="Guardar"
						action="#{editEnfermSintoma.saveNewData()}"
						styleClass="button" reRender="afflicSympForm, afflicSympGridForm"
						oncomplete="window.location.reload()">

					</a4j:commandButton>
					<rich:spacer width="20px" />
					<a4j:commandButton value="Cancelar"
						action="#{editEnfermSintoma.cancelData()}"
						reRender="afflicSympForm, afflicSympGridForm, symptomSelect" styleClass="button"
						oncomplete="window.location.reload()"/>

				</s:decorate>
			</h:panelGrid>
			</rich:panel>

		</a4j:form>
		
		

	</ui:define>

</ui:composition>